$toolbar-height: 64px - 1px;
.menu-button {
  position: relative;

  .unreadCount {
    position: absolute;
    top: 3px;
    right: 4px;
  }
}

.member-info-disabled-warning {
  background: rgba(0, 0, 0, 0.1);
}

.client-info {
  color: white;
  background: #666;
  border: 1px solid #2196f3;
  font-size: 12px;
  padding: 2px 4px;
  margin-left: 6px;

  &.owner {
    background: #2196f3;
  }

  &.manager {
    background: transparent;
    color: #2196f3;
  }
}

.md-errors-spacer:empty {
  display: none;
}

.md-resize-handle:empty {
  display: none;
}

.typing-indicator {
  height: 0;

  >span {
    display: inline-block;
    position: relative;
    top: -30px;
    line-height: 30px;
    font-size: 14px;
    padding: 0 6px;
    color: white;
    background-color: #666;
  }
}

$max-witdh: 480px;
.smileys-selector {
  width: 98%;
  max-width: $max-witdh;
  margin: 0 auto 4px;
  background-color: rgb(250,250,250);
  padding: 0;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
}
.smileys {
  height: 240px;
  overflow-y: auto;

  > .smiley {
    font-size: 150%;
    &.sticker {
      $size: $max-witdh / 4 - 16px;
      width: $size;
      height: $size;
      > img {
        margin: 6px;
        vertical-align: middle;
      }
    }
  }
  .note {
    font-size: 80%;
    text-align: center;
    > .link {
      text-decoration: none;
      color: #999;
    }
  }
}
.smileys-type {
  text-align: center;
  font-size: 80%;
  padding: 10px 0;
  &:not(.active) {
    background: #d0d0d0;
  }
}

.mention-suggestion {
  position: absolute;
  bottom: 100%;
  margin-bottom: 6px;
  width: 100%;
  background-color: rgb(250,250,250);
  padding: 0;
  left: 0;
  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.2);
  
  > md-list-item.active {
    background-color: rgba(0, 0, 0, 0.1);
  }
}

.editor {
  max-width: 480px;

  &-wrapper {
    min-height: 58px;
    background-color: rgb(250,250,250);
  }

  .textarea {
    padding: 12px 8px;
    margin: 0;
  }
}

.max-results-amount-hint {
  color: rgba(0,0,0,.5);
  text-align: center;
  font-size: 0.9em;
}

.messages {
  background-color: transparent;
  height: 0;

  &-wrapper {
    max-width: 480px;
    margin: 0 auto;
  }
}

.search-box {
  height: $toolbar-height;
  line-height: $toolbar-height;

  input {
    outline: none;
    border: none;
    height: $toolbar-height;
  }
}

md-list.result,
md-list.square-clients {
  overflow: auto;
  -webkit-overflow-scrolling: touch;

  .client-actions-menu {
    margin-right: -8px;
  }
}

.result-item {
  padding-left: 60px - 16px;
}
